
//定义路由规则，路由规则由两部分组成，path和component
import Vue from "vue";
import Router from "vue-router";
import Layout from '@/layout'; // 布局页

Vue.use(Router);

// 通用页面
export const constRoutes =[
  {
    path: "/404",
    component: () => import("@/views/404"),
    hidden: true
  },
  {
    path: "/login",
    component: () => import("@/views/Login"),
    hidden: true  // 隐藏 导航菜单忽略该项，不显示
  },
  {
    path: "/",
    component: Layout,  // 应用布局页,指定该路由渲染的组件为 Layout,Layout 是一个布局组件，负责定义页面的公共结构（如顶部导航栏、侧边栏、页脚等）,子路由的组件会渲染在 Layout 的 <router-view> 插槽位置。
    redirect: "/home",  // 重定向到子路由
    meta: { title: "首页", icon: "home" },  // 菜单名称和图标
    children:[
      {
        path: "home",  // 子路由路径（相对父路径）
        name: "home", // 路由唯一标识，用于路由跳转
        component: () => import(/* webpackChunkName: "home" */"@/views/Home"),
        meta: { title: "Home",  // 菜单名称
                icon: "qq" }  // 菜单图标
      },{
        path: "mua",  // 子路由路径（相对父路径）
        name: "mua", // 路由唯一标识，用于路由跳转
        component: () => import(/* webpackChunkName: "home" */"@/views/Home"),
        meta: { title: "mua波一个",  // 菜单名称
                icon: "wx" }  // 菜单图标
      }
    ]
  }
]

//权限页面
export const asyncRoutes = [
    {
        path:"/about",
        component: Layout,
        redirect: "/about/index",
        meta: { title: "关于", icon: "home" },
        children:[
            {
                path: "index",
                name: "about",
                component: () => import(/* webpackChunkName:"home" */"@/views/About.vue"),
                meta: { title: "用户中心",  // 菜单名称
                        icon: "qq" ,   // 菜单图标
                        roles: ['admin']  // 权限
                        }  
            },
            {
                path: "bla",
                name: "bla",
                component: () => import(/* webpackChunkName:"home" */"@/views/About.vue"),
                meta:{ 
                  title: "关于我们",  // 菜单名称
                  icon: "wx" ,   // 菜单图标
                  roles: ['editor']  // 权限
                }
            }
        ]
    }
]

export default new Router({
  mode: "history",
  base: process.env.BASE_URL,
  routes: constRoutes
})